class Carousel {
  constructor($, options) {
    // == dom 节点
    // 页面操作目标节点
    this.$dom = $(options.dom);
    // 所有的轮播节点
    this.oCarItems = this.$dom.find('.car-item');
    // 左右按钮
    this.oCarBtns = this.$dom.find('.car-button');
    // 所有的小圆点
    this.oCarIndicators = this.$dom.find('.indicator-btn');

    // 下标处理最小值
    this.MINLEN = 0;
    // 移入类型
    this.INTYPE = 0;
    // 移出类型 
    this.OUTTYPE = 1;
    // 自动滚动时的速率
    this.speed = options.speed;
    // 当前轮播到的图片下标
    this.curIndex = 0;
    // 计时器，用于自动轮播
    this.timer = null;
  }

  bindClickEvent() {
    // 监听鼠标的移入移出
    this.$dom.on('mouseover', { type: this.INTYPE }, $.proxy(this.mouseOutIn, this));
    this.$dom.on('mouseout', { type: this.OUTTYPE }, $.proxy(this.mouseOutIn, this));
    // 监听轮播页面的点击事件：可能有按钮，可以能有小圆点，所以在触发的函数内部分别处理
    this.$dom.on('click', $.proxy(this.carClick, this));
  }

  // 鼠标移入移出事件处理
  mouseOutIn(event) {
    const type = event.data.type;
    switch (type) {
      case this.INTYPE:
        // console.log('移入了');
        // 移入时删除定时器
        clearInterval(this.timer);
        break;
      case this.OUTTYPE:
        // 移出时重新开始自动轮播
        // console.log('移出了');
        this.autoCarousel();
        break
      default:
        break;
    }
  }

  autoCarousel() {
    this.timer = setInterval($.proxy(this.run, this), this.speed);
  }
}

export { Carousel };